const { defineConfig } = require('@vue/cli-service')
const Timestamp = new Date().getTime();
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
module.exports = defineConfig({
  // devServer: {
  //   host: '128.0.0.1',
  //   port: 8080,
  //   client: {},
  //   headers: {
  //     'Access-Control-Allow-Origin': '*',
  //   }
  // }


  transpileDependencies: true,
  publicPath: '/',
  // chainWebpack(config) {
  //   config.optimization.minimizer('terser').tap((args) => {
  //     args[0].terserOptions.compress.drop_console = true
  //     return args
  //   })
  // },
  productionSourceMap: process.env.NODE_ENV !== "production", //打包不生成map文件
  configureWebpack: {
    output: {
      // 输出重构  打包编译后的 文件名称  【模块名称.版本号.时间戳】
      filename: `js/[name].${Timestamp}.js`,
      chunkFilename: `js/[name].${Timestamp}.js`,
    },
    plugins: [
      new BundleAnalyzerPlugin({
        analyzerPort: 9999, // 指定自定义端口号
      }),
      // new CompressionPlugin({
      //   filename: '[path][base].gz',
      //   algorithm: 'gzip',
      //   test: /\.js$|\.css$|\.html$/,
      //   threshold: 10240,
      //   minRatio: 0.8
      // }),


    ],
    optimization: {
      runtimeChunk: 'single',
      splitChunks: {
        chunks: 'all',
        maxInitialRequests: 10,
        minSize: 20000,
        cacheGroups: {
          vendor: {
            test: /[\\/]node_modules[\\/]/,
            priority: -10, // 优先级，先打包到哪个组里面，值越大，优先级越高
            filename: 'vendors.js'
          },
          // default: { // 默认打包模块
          //   priority: -20,
          //   reuseExistingChunk: true, // 模块嵌套引入时，判断是否复用已经被打包的模块
          //   filename: 'common.js'
          // }
        }
      }
    },
  },

  css: {
    // 自定义CSS文件名
    extract: {
      filename: 'css/[name].[contenthash].css',
      chunkFilename: 'css/[name].[contenthash].css',
    },
  },
})
